<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Q.extend | Q,js</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="../Q.js"></script>
<script>
<!--

/** 创建klass_test类
 *
 * @constructor
 * @param {number} arg1 - 参数1
 * @param {number} arg2 - 参数2
 */
var klass_test = Q.extend({
	// 成员变量
	m1 : 1,
	m2 : 2,

	__init__ : function(arg1, arg2) {
		this.m1 = arg1;
		this.m2 = arg2;
	},

	/** 实现两个数的相加
   * @memberof klass_test.prototype
   */	
  add : function(a, b) {
		return a+b;
	},

	/** 弹出提示框
   *
   * @memberof klass_test.prototype
   */
  msgbox : function(str) {
		alert(str);
	},

	/** 显示成员变量
   *
   * @memberof klass_test.prototype
   */
	showMembers : function() {
		var str = 'members:\n';

		str = 'm1 = ' + this.m1 + '\n';
		str +='m2 = ' + this.m2;

		this.msgbox(str);
	}
});

Q.ready(function() {
		// 获取界面元素
		var NumA = Q.$('idA');
		var NumB = Q.$('idB');
		var NumC = Q.$('idC');

		// 创建klass_test对象
		var oKlassTest = new klass_test(NumA.value, NumB.value);

		// 按钮
		var BtnAdd = Q.$('idBtnAdd');
		var BtnTest = Q.$('idBtnTest');
		var BtnShowMembers = Q.$('idBtnShowMembers');

		// 给按钮添加onclick事件
		BtnAdd.onclick = function() {
			// 调用oKlassTest.add实现两个数相加
			NumC.value = oKlassTest.add(
				parseInt(NumA.value), 
				parseInt(NumB.value)
			);
		}

		BtnTest.onclick = function() {
			// 调用oKlassTest的msgbox函数
			oKlassTest.msgbox('调用samples.klass的msgbox函数');
		}

		BtnShowMembers.onclick = function() {
			// 显示oKlassTest的成员变量
			oKlassTest.showMembers();
		}

	});
-->
</script>
</head>
<body>
<div id="myDiv">
	<br>
	<button id="idBtnAdd"> 两个数相加 </button>
	<button id="idBtnTest"> 调用samples.klass类的msgbox函数 </button>
	<button id="idBtnShowMembers"> 显示klass_test的成员变量和值 </button>
  <hr>
	<input type="text" id="idA" value="6"/>+
	<input type="text" id="idB" value="6"/>= 
	<input type="text" id="idC" readOnly/><br />
</div>
</body>
</html>
